<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>悦跑校园</title>
    <link rel="stylesheet" href="css/common.css"/>
    <link rel="stylesheet" href="css/blog_detail.css"/>
    <link rel="stylesheet" href="css/down-id.css"/>
    <style>
        img {
            width: 200px;
        }
    </style>
</head>
<body>
<!-- 导航栏 -->
<div class="nav">
    <img src="image/log.png" alt=""/>
    <span class="title">CFBlog</span>
    <!-- 使用 span 把左右两侧的元素给撑开 -->
    <span class="spacer"></span>
    <a href="index.html">主页</a>
</div>
<!-- 版心 -->
<div class="container">
    <!-- 左侧区域，显示用户信息 -->
    <div class="container-left">
        <!-- 用户详情 -->
        <div class="card">
            <!-- 用户的头像 -->
            <img src="image/head.jpg" alt=""/>
            <!-- 用户名 -->
            <h3>春风能解释</h3>
            <!-- 其它信息 -->
            <a href="https://github.com/2516649281">GitHub 地址</a>
            <a href="https://gitee.com/cfnjs20020602">Gitee 地址</a>
            <a>QQ:2516649281</a>
            <!-- 文章分类 -->
            <div class="counter">
                <span>文章</span>
                <span>分类</span>
            </div>
            <div class="counter">
                <span>3</span>
                <span>1</span>
            </div>
        </div>
    </div>
    <!-- 右侧区域，显示博客列表 -->
    <div class="container-right">
        <!-- 使用这个 div 来放博客内容 -->
        <div class="blog-content">
            <!-- 博客的标题 -->
            <h3>悦跑校园</h3>
            <!-- 博客的日期 -->
            <div class="date">2023-1-11</div>
            <!-- 博客的内容 -->
            <div
                    class="detail"
                    style="overflow: auto; height: 450px; width: 100%"
            >
                <h1 id="悦跑校园">悦跑校园</h1>
                <p>一切为了同学们!</p>
                <p>
                    <img
                            src="https://img.shields.io/badge/Java-1.8+-green.svg"
                            alt=""
                    /><img
                        src="https://img.shields.io/badge/MySQL-5.7+-blue.svg"
                        alt=""
                /><img
                        src="https://img.shields.io/badge/Vue-3.0+-red"
                        alt=""
                /><img
                        src="https://img.shields.io/badge/Maven-3.0+-blue"
                        alt=""
                />
                </p>
                <p>
                    <a href="https://www.cnblogs.com/cfnjs"
                    ><img
                            src="https://img.shields.io/badge/blog-@cfnjs-red.svg"
                            alt=""
                    /></a>
                </p>
                <p>
                    <a href="https://gitee.com/cfnjs20020602/lerun2"
                    ><img
                            src="https://gitee.com/cfnjs20020602/lerun2/badge/star.svg?theme=dark"
                            alt="star"/></a
                    ><a href="https://gitee.com/cfnjs20020602/lerun2"
                ><img
                        src="https://gitee.com/cfnjs20020602/lerun2/badge/fork.svg??theme=dark"
                        alt="fork"
                /></a>
                    <a href="https://gitee.com/cfnjs20020602/lerun2"
                    ><img
                            src="https://img.shields.io/badge/version-v1.0-brightgreen.svg"
                            alt=""
                    /></a>
                </p>
                <p>本篇README.md面向开发者</p>
                <h2 id="目录">目录</h2>
                <ul>
                    <li>
                        <a href="#%E4%B8%8A%E6%89%8B%E6%8C%87%E5%8D%97">上手指南</a>
                        <ul>
                            <li>
                                <a
                                        href="#%E5%BC%80%E5%8F%91%E5%89%8D%E7%9A%84%E9%85%8D%E7%BD%AE%E8%A6%81%E6%B1%82"
                                >开发前的配置要求</a
                                >
                            </li>
                            <li>
                                <a href="#%E5%AE%89%E8%A3%85%E6%AD%A5%E9%AA%A4">安装步骤</a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a
                                href="#%E6%96%87%E4%BB%B6%E7%9B%AE%E5%BD%95%E8%AF%B4%E6%98%8E"
                        >文件目录说明</a
                        >
                    </li>
                    <li>
                        <a href="#%E5%BC%80%E5%8F%91%E7%9A%84%E6%9E%B6%E6%9E%84"
                        >开发的架构</a
                        >
                    </li>
                    <li><a href="#%E9%83%A8%E7%BD%B2">部署</a></li>
                    <li>
                        <a
                                href="#%E4%BD%BF%E7%94%A8%E5%88%B0%E7%9A%84%E6%A1%86%E6%9E%B6"
                        >使用到的框架</a
                        >
                    </li>
                    <li>
                        <a href="#%E8%B4%A1%E7%8C%AE%E8%80%85">贡献者</a>
                        <ul>
                            <li>
                                <a
                                        href="#%E5%A6%82%E4%BD%95%E5%8F%82%E4%B8%8E%E5%BC%80%E6%BA%90%E9%A1%B9%E7%9B%AE"
                                >如何参与开源项目</a
                                >
                            </li>
                        </ul>
                    </li>
                    <li>
                        <a href="#%E7%89%88%E6%9C%AC%E6%8E%A7%E5%88%B6">版本控制</a>
                    </li>
                    <li><a href="#%E4%BD%9C%E8%80%85">作者</a></li>
                    <li><a href="#%E9%B8%A3%E8%B0%A2">鸣谢</a></li>
                </ul>
                <h3 id="项目概述">项目概述</h3>
                <p>
                    悦跑校园，帮助同学们实现校园内代取外卖，代买饭菜的外卖型跑腿系统，该系统分为管理端、跑腿端、用户端，其中，管理端采用PC端UI设计，跑腿端与用户端采用移动端UI设计，该系统旨在帮助同学们腾出空余时间，减少同学们的学习压力，帮助同学们高效的利用空余时间
                </p>
                <p>部分界面展示:</p>
                <p>管理端UI</p>
                <p><img src="image/1-4.png" alt="1-4"/></p>
                <p><img src="image/1-5.png" alt="1-5"/></p>
                <p>跑腿端UI</p>
                <p><img src="image/1-3.png" alt="1-3"/></p>
                <p>用户端UI</p>
                <p><img src="image/1-1.png" alt="1-1"/></p>
                <p><img src="image/1-2.png" alt="1-2"/></p>
                <h3 id="上手指南">上手指南</h3>
                <h6 id="开发前的配置要求">开发前的配置要求</h6>
                <ol>
                    <li>jdk1.8</li>
                    <li>Vue 3.0及以上版本</li>
                </ol>
                <h6 id="安装步骤"><strong>安装步骤</strong></h6>
                <p>后端部署:</p>
                <p>1.拉取仓库</p>
                <pre><code class="language-sh">git clone https://gitee.com/cfnjs20020602/lerun2
</code></pre>
                <p>2.使用IDEA或其他开发者工具，并执行Maven打包操作</p>
                <pre><code class="language-sh">mvn package install
</code></pre>
                <ol start="3">
                    <li>启动项目</li>
                </ol>
                <pre><code class="language-sh">java -jar xxx.jar(xxx为打包后的文件名)
</code></pre>
                <p>前端部署:</p>
                <p>请参考vue项目下的README.md文件</p>
                <h3 id="文件目录说明">文件目录说明</h3>
                <p>eg:</p>
                <pre><code>filetree
├─data  //数据库脚本所在目录
├─src   //项目根目录
│  ├─main
│  │  ├─java  //源代码目录
│  │  │  └─com
│  │  │      └─chunfeng
│  │  │          ├─config   //配置类所在目录
│  │  │          ├─controller   //Controller类所在目录
│  │  │          ├─entity   //实体类
│  │  │          ├─interceptor  //拦截器
│  │  │          ├─mapper  //MyBatis映射接口
│  │  │          ├─result  //负责统一后端响应体
│  │  │          ├─service  //业务层接口和实现类
│  │  │          │  └─impl  //业务层实现类
│  │  │          └─utils  //工具类
│  │  └─resources //资源目录
│  │      ├─mappers //mapper映射XML文件
│  │      ├─static
│  │      └─templates
│  └─test //测试代码
│      └─java
│          └─com
│              └─chunfeng
├─target  //打包后的文件(执行Maven打包后可见)
</code></pre>
                <h3 id="开发的架构">开发的架构</h3>
                <p>后端: SpringBoot+Redis</p>
                <p>前端: Vue3+Element-plus/Vant+Axios</p>
                <h3 id="部署">部署</h3>
                <p>暂无</p>
                <h3 id="使用到的框架">使用到的框架</h3>
                <ul>
                    <li><a href="https://spring.io/">SpringBoot</a></li>
                    <li><a href="https://mybatis.net.cn/">MyBatis</a></li>
                    <li><a href="https://cn.vuejs.org/">Vue</a></li>
                    <li>
                        <a href="https://element-plus.gitee.io/zh-CN/">Element-plus</a>
                    </li>
                    <li><a href="https://vant-ui.github.io/vant/#/zh-CN">Vant</a></li>
                </ul>
                <h3 id="贡献者">贡献者</h3>
                <p>请查阅Gitee贡献者</p>
                <h4 id="如何参与开源项目">如何参与开源项目</h4>
                <p>
                    贡献使开源社区成为一个学习、激励和创造的绝佳场所。你所作的任何贡献都是<strong>非常感谢</strong>的。
                </p>
                <ol>
                    <li>Fork the Project</li>
                    <li>
                        Create your Feature Branch (<code
                    >git checkout -b feature/AmazingFeature</code
                    >)
                    </li>
                    <li>
                        Commit your Changes (<code
                    >git commit -m &#39;Add some AmazingFeature&#39;</code
                    >)
                    </li>
                    <li>
                        Push to the Branch (<code
                    >git push origin feature/AmazingFeature</code
                    >)
                    </li>
                    <li>Open a Pull Request</li>
                </ol>
                <h3 id="版本控制">版本控制</h3>
                <p>
                    该项目使用Git进行版本管理。您可以在repository参看当前可用版本。
                </p>
                <h3 id="作者">作者</h3>
                <p>春风能解释@chunfeng</p>
                <p>qq:2516649281</p>
                <p><em>您也可以在贡献者名单中参看所有参与该项目的开发者。</em></p>
                <h3 id="版权说明">版权说明</h3>
                <p>
                    该项目签署了MIT 授权许可，详情请参阅
                    <a
                            href="https://github.com/shaojintian/Best_README_template/blob/master/LICENSE.txt"
                    >LICENSE.txt</a
                    >
                </p>
                <h3 id="鸣谢">鸣谢</h3>
            </div>
        </div>
    </div>
</div>
<div class="down">
    <a target="_blank" href="https://beian.miit.gov.cn/shouye.html" style="">
        <p>鄂ICP备2023000084号-1</p></a
    >
    &nbsp;&nbsp;&nbsp;&nbsp;
    <a
            target="_blank"
            href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=42282202000149"
    ><img src="./image/备案图标.png" style="float: left; width: 20px"/>
        <p>鄂公网安备 42282202000149号</p></a
    >
</div>
</body>
</html>
